{# @prop as 'div' The HTML tag to use, default to `div` #}
{# @block content The default block #}
{%- props as = 'div' -%}
<{{ as }}
    data-slot="button-group-text"
    class="{{ 'bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*=\'size-\'])]:size-4 ' ~ attributes.render('class')|tailwind_merge }}"
    {{ attributes }}
>
    {%- block content %}{% endblock -%}
</{{ as }}>
